<!DOCTYPE html>
<html>
  <head>
    <!-- Required meta tags-->
    <meta charset="utf-8">
    <meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui, viewport-fit=cover">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="default">
<meta name="theme-color" content="#2196f3">
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
    <!-- Your app title -->
    <title>shop</title>
    <!-- Path to Framework7 Library CSS, Material Theme -->
    <link rel="stylesheet" href="./lib/css/framework7.css">
    <link rel="stylesheet" href="./css/icons.css">
	<link rel="stylesheet" href="./css/iconfont.css">
	<link rel="stylesheet" href="./css/app.css">
    <!-- Path to your custom app styles-->
  </head>
  <body  class="color-theme-white">
    <!-- App root element -->
    <div id="app">
      <!-- Statusbar overlay -->
      <div class="statusbar"></div>
      
      <!-- Views/Tabs container -->
    <!-- Views/Tabs container -->
		<div class="views tabs ios-edges">
			<!-- Tabbar for switching views-tabs -->
			<div class="toolbar tabbar-labels toolbar-bottom-md bottom-bar">
				<div class="toolbar-inner">
					<a href="#view-home" class="tab-link tab-link-active homeTab">
						<i class="icon f7-icons ios-only icon-ios-fill">home_fill</i>  <span
						class="tabbar-label">首页</span> </a> 
					<a href="#view-cart" id="view-cart-tab" class="tab-link cartTab">
						<i class="icon f7-icons ios-only icon-ios-fill">home_fill</i>  <span
						class="tabbar-label">购物车</span> </a> 
					<a href="#view-person" id="view-person-tab"
						class="tab-link personTab">
						<i class="icon f7-icons ios-only icon-ios-fill">list_fill</i> <span
						class="tabbar-label">个人中心</span> </a>
				</div>
			</div>
      <!-- Your main view/tab, should have "view-main" class. It also has "tab-active" class -->
      <div id="view-home" class="view view-main tab tab-active">
        <!-- Initial Page, "data-name" contains page name -->
				<div data-name="home" class="page ">
					<!-- Top Navbar -->
					<div class="navbar">
						<div class="navbar-inner">
					      <div class="left">
					      </div>
					      <div class="title" style="width:100%;">
					      	 <!-- Searchbar with auto init -->
					        <form class="searchbar" style="background:none;">
					          <div class="searchbar-inner">
					            <div class="searchbar-input-wrap">
					            	<a href="/home/search">
					              <input type="search" name="key" placeholder="Search">
					              </a>
					              <i class="searchbar-icon"></i>
					              <span class="input-clear-button"></span>
					            </div>
					          </div>
					        </form>
					      </div>
					      <div class="right">
					      </div>
					    </div>
					    
					    
					</div>
					<!-- Scrollable page content -->
					<div class="page-content home-page">
					
						<div class="home-slide">
							
						</div>
						
						<div class="research-container">
							<div class="row first">
							    <div class="col">
							    	<div class="row title">男神Style</div>
							    	<div class="row subtitle">男神Style</div>
							    	<div class="row img">
							    		<img src="img/home/pic-01.png">
							    	</div>
							    </div>
							    <div class="col">
						    		<div class="row title">男神Style</div>
						    		<div class="row subtitle">男神Style</div>
							    	<div class="row img">
							    		<img src="img/home/pic-02.png">
							    	</div>
							    </div>
							    <div class="col">
						    		<div class="row title">男神Style</div>
							    	<div class="row subtitle">男神Style</div>
							    	<div class="row img">
							    		<img src="img/home/pic-01.png">
							    	</div>
							    </div>
							</div>
							<div class="row second">
							    <div class="col">
						    		<div class="row title">男神Style</div>
							    	<div class="row subtitle">男神Style</div>
							    	<div class="row img">
							    		<img src="img/home/pic-02.png" >
							    	</div>
							    </div>
							    <div class="col center-col">
						    		<div class="row title">男神Style</div>
							    	<div class="row subtitle">男神Style</div>
							    	<div class="row img">
							    		<img src="img/home/pic-01.png" >
							    	</div>
							    </div>
							    <div class="col">
						    		<div class="row title">男神Style</div>
							    	<div class="row subtitle">男神Style</div>
							    	<div class="row img">
							    		<img src="img/home/pic-02.png">
							    	</div>
							    </div>
							</div>
						</div>
						
						<div class="list home-product-list-container">
							
					    </div>
						
					</div>
				</div>
      </div>

      <!-- Catalog View -->
      <div id="view-cart" class="view view-cart tab">
      </div>

      <!-- Settings View -->
      <div id="view-person" class="view view-person tab">
      </div>
      
    </div>
    
 
 		<!-- 首页轮播图  -->
		<script id="homeSlideTemplate" type="text/template7">
				<div data-pagination='{"el": ".swiper-pagination"}' data-space-between="10" data-slides-per-view="auto" data-centered-slides="true" class="swiper-container home-swiper-container swiper-init demo-swiper demo-swiper-auto">
  						<div class="swiper-pagination"></div>
  						<div class="swiper-wrapper">
							{{#each slideList}}
    							<div class="swiper-slide"><img src="{{img}}" style="width:100%;height:100%;" class="lazy"></div>
							{{/each}} 					 		
  						</div>
				</div>
		</script>
		
		
		<!-- 商品详情页轮播图  -->
		<script id="productSlideTemplate" type="text/template7">
				<div data-pagination='{"el": ".swiper-pagination"}' data-space-between="10" data-slides-per-view="auto" data-centered-slides="true" class="swiper-container swiper-init demo-swiper demo-swiper-auto product-detail-swiper">
  						<div class="swiper-pagination"></div>
  						<div class="swiper-wrapper">
							{{#each slideList}}
    							<div class="swiper-slide"><img src="{{img}}" style="width:100%;height:100%;" class="lazy"></div>
							{{/each}} 					 		
    						<div class="swiper-slide">详情</div>
  						</div>
				</div>
		</script>
		
				<!-- 商品列表 -->
		<script id="productListTemplate" type="text/template7">
			<div class="list-group">
				<ul class="home-product-list no-background">
					<li class="list-group-title">商品</li>
				{{#each productList}}
					<li class="item-content">
						<a href="/product/1" class="item-row row-100" style="padding-left:5px;padding-right:5px;padding-top:5px;">
							{{#each item}}
								<div class="item-cell item-cell-{{@index}}" style="width:50%;background:#fff;">
									<div class="img"><img src="{{img}}" style="width:80%;height:80%;"></div>
									<div class="subtitle">{{subtitle}}</div>
								</div>
							{{/each}}
						</a>
					</li>
				{{/each}}
  				</ul>
			</div>
		</script>
		
				<!-- 商品列表 -->
		<script id="recommendProductListTemplate" type="text/template7">
			<div class="list-group">
				<ul class="home-product-list no-background">
					<li class="list-group-title">推荐商品</li>
				{{#each productList}}
					<li class="item-content">
						<div class="item-row row-100" style="padding-left:5px;padding-right:5px;padding-top:5px;">
							{{#each item}}
								<div class="item-cell item-cell-{{@index}}" style="width:50%;background:#fff;">
									<div class="img"><img src="{{img}}" style="width:80%;height:80%;"></div>
									<div class="subtitle">{{subtitle}}</div>
								</div>
							{{/each}}
						</div>
					</li>
				{{/each}}
  				</ul>
			</div>
		</script>
		
		
		<!-- 购物车商品列表 -->
		<script id="cartTemplate" type="text/template7">
			<div class="list media-list list-group cart">
  				<ul>
					{{#each cartList}}
					<li class="list-group-title">{{storeName}}</li>

					{{#each products}}
    				<li class="swipeout">
      					<div class="item-content swipeout-content">
							
       				 		<div class="item-media">
								<label class="item-checkbox  ">
									<input type="checkbox" name="cartProduct" value="{{storeId}}-{{productId}}"/>
        							<i class="icon icon-checkbox"></i>
								</label>
								<img src="{{img}}" width="80"/>
							</div>
        					<div class="item-inner">
								<div class="cart-edit-container">
									<div style="width:80%;float:left;">
										<div class="row margin-top">
						    				<div class="col">
						      					<div class="stepper stepper-raised stepper-big stepper-init">
						        					<div class="stepper-button-minus"></div>
						        					<div class="stepper-input-wrap">
						          						<input type="text" value="{{quantity}}" min="1" max="100" step="1" readonly>
						        					</div>
						        					<div class="stepper-button-plus" ></div>
						      					</div>
						    				</div>
										</div>			
									</div>						 
									<div style="width:20%;float:right;">
										<div class="btn button button-fill color-orange finish-btn" data-productId="{{productId}}" data-storeId="{{storeId}}">完<br/>成</div>
									</div>
								</div>
									
								<div class="item-title-row">
          							<div class="item-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sagittis tellus ut turpis condimentum, ut dignissim lacus tincidunt. Cras dolor metus, ultrices condimentum sodales sit amet, pharetra sodales eros. Phasellus vel felis tellus. Mauris rutrum ligula nec dapibus feugiat. In vel dui laoreet, commodo augue id, pulvinar lacus.</div>
            						<div class="item-after item-edit-btn"><i class="f7-icons">bars</i></div>
          						</div>  
								<div class="item-title-row">
            						<div class="item-subtitle option">蓝(S)码</div>
          						</div> 
								<div class="item-title-row">
            						<div class="item-title price">{{price}}</div>
            						<div class="item-after quantity">x{{quantity}}</div>
          						</div>        					
							</div>
						</div>
						<div class="swipeout-actions-right">
        					<a href="#" class="swipeout-delete delete" data-store-id="{{storeId}}" data-product-id="{{productId}}">删除</a>
							<a href="#" class="color-orange wish">收藏</a>
      					</div>
					</li>
					{{/each}}
				{{/each}}
				</ul>
			</div>
		</script>
		
		
		<!-- 订单商品列表 -->
		<script id="orderProductTemplate" type="text/template7">
			<div class="list media-list list-group cart">
  				<ul>
					{{#each payProducts}}
					<li class="list-group-title">{{storeName}}</li>

					{{#each products}}
    				<li >
      					<div class="item-content">
       				 		<div class="item-media">
								<img src="{{img}}" width="80"/>
							</div>
        					<div class="item-inner">
								<div class="item-title-row">
          							<div class="item-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sagittis tellus ut turpis condimentum, ut dignissim lacus tincidunt. Cras dolor metus, ultrices condimentum sodales sit amet, pharetra sodales eros. Phasellus vel felis tellus. Mauris rutrum ligula nec dapibus feugiat. In vel dui laoreet, commodo augue id, pulvinar lacus.</div>
          						</div>  
								<div class="item-title-row">
            						<div class="item-subtitle option">蓝(S)码</div>
          						</div> 
								<div class="item-title-row">
            						<div class="item-title price">{{currency}}{{price}}</div>
            						<div class="item-after quantity">x{{quantity}}</div>
          						</div>        					
							</div>
						</div>
					</li>
					{{/each}}
					<li>
						<div class="item-content">
            				<div class="item-inner">
								<div class="item-subtitle">给卖家留言:<input type="text" name="message" placeholder="留言内容"/></div>
							</div>
						</div>
					</li>
					<li>
						<div class="item-content">
            				<div class="item-after quantity price">总金额:{{total}}</div>
						</div>
					</li>
				{{/each}}
				</ul>
			</div>
		</script>
		
		<script id="paySheetTemplate" type="text/template7">		
			<div class="sheet-modal my-sheet">
    			<div class="toolbar">
      				<div class="toolbar-inner">
        				<div class="left"></div>
        				<div class="right"><a class="link sheet-close" href="#"><i class="f7-icons">close</i></a></div>
      				</div>
    			</div>
    			<div class="sheet-modal-inner">
      				<div class="list links-list">
  						<ul>
    						<li>
      							<a href="#" class="alipayPayBtn">支付宝支付</a>
    						</li>
    						<li>
      							<a href="#" class="wxPayBtn">微信支付</a>
    						</li>
    						<li>
      							<a href="#" class="balancePayBtn">余额支付</a>
    						</li>
  						</ul>
					</div>
    			</div>	
			</div>	
		</script>   
      
      	<!-- 订单商品列表 -->
		<script id="orderListTemplate" type="text/template7">
					{{#each orderList}}
			<div class="list media-list list-group cart" style="margin-bottom:5px;">
  				<ul>
					<li class="list-group-title" style="padding:0;">
						<div class="list" style="margin:0;">
							<ul style="padding-left:5px;">
								<li>
									<a  href="/order/shipping/history" class="item-content item-link">
										<div class="item-media"><img src="img/f7-icon.png" width="25px;"></div>
										<div class="item-inner">
          									<div class="item-title" style="width:40%;float:left;">
            									同仁堂
          									</div>
          									<div class="" style="width:50%;float:right;text-align:right;padding-right:10px;">订单已关闭</div>
        								</div>
									</a>
								</li>
							</ul>
						</div>
					</li>
    				<li >
      					<div class="item-content">
       				 		<div class="item-media">
								<img src="img/f7-icon.png" width="80"/>
							</div>
        					<div class="item-inner">
								<div class="item-title-row">
          							<div class="item-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sagittis tellus ut turpis condimentum, ut dignissim lacus tincidunt. Cras dolor metus, ultrices condimentum sodales sit amet, pharetra sodales eros. Phasellus vel felis tellus. Mauris rutrum ligula nec dapibus feugiat. In vel dui laoreet, commodo augue id, pulvinar lacus.</div>
          						</div>  
								<div class="item-title-row">
									<div class="item-subtitle option">蓝(S)码</div>
            						<div class="item-after quantity">x2</div>
          						</div> 
								<div class="item-title-row">
            						<div class="item-after quantity price">￥100</div>
          						</div>        					
							</div>
						</div>
					</li>
					<li>
						<div class="item-content">
            				<div class="item-inner">
								<div class="item-subtitle" style="text-align:right;">共计1件商品 合计:$200.00</div>
							</div>
						</div>
					</li>
					<li>
						<div class="item-content" style="padding-right:15px;">
            				<a  class="button button-fill color-orange  cancleOrder">取消订单</a><a class="button button-fill color-orange orderListPayBtn">付款</a><a href="/order/assess" class="button button-fill color-orange">评价</a>
						</div>
					</li>
				</ul>
			</div>
				{{/each}}
		</script>
		
		
		<!-- 商品评价列表 -->
		<script id="orderProductAssessTemplate" type="text/template7">
			{{#each orderProductList}}		 
				<div class="card demo-facebook-card" style="width:100%;margin-left:0px;margin-right:0px;">
  					<div class="card-header">
    					<div class="demo-facebook-avatar"><img src="img/f7-icon.png" width="60" height="60"/></div>
    					<div class="demo-facebook-name" style="height:60px;line-height:60px;">
							<div class="order-evaluation clearfix">
								<div class="list">
    								<ul>
      									<li data-default-index="0">
            								<span>
              									<img src="img/x1.png">
              									<img src="img/x1.png">
              									<img src="img/x1.png">
              									<img src="img/x1.png">
              									<img src="img/x1.png">
            								</span>
        									<span class="level"></span>
      									</li>
    								</ul>
  								</div>
							</div>
						</div>
  					</div>
  					<div class="card-content" style="padding-left:1px;padding-right:1px;">
						<textarea placeholder="评价不少于20个汉字" style="width:100%;height:80px;background:#eee;"></textarea> 
					</div>
				</div>
			{{/each}}
		</script>
		
		<!-- 订单轨迹  -->
		<script id="order-shipping-history-container" type="text/template7">		
			<!-- Timeline -->
			<div class="timeline">
				{{#each shippingHistory}}
  				<div class="timeline-item">
    				<div class="timeline-item-date">2018-06-09 11:10:20</div>
    				<div class="timeline-item-divider"></div>
    				<div class="timeline-item-content">
      					<div class="timeline-item-inner">Another text goes her1111111111111111111111111111111111111111111111e</div>
    				</div>
  				</div>
				{{/each}}
			</div>
		</script>   		
		
		
		
      	<div class="block block-strong text-align-center">
  			<div class="preloader color-multi"></div>
		</div>
    </div>
    
    <!-- Cordova -->
	<script src="cordova.js"></script>
	<!-- Your custom app scripts -->
	<script src="config.js"></script>
    <!-- Path to Framework7 Library JS-->
    <script type="text/javascript" src="lib/js/framework7.js"></script>
	<!-- App routes -->
	<script src="js/routes.js"></script>
    <!-- Path to your app js-->
	<script type="text/javascript" src="js/help.js"></script>
    <script type="text/javascript" src="js/app.js"></script>
    <script type="text/javascript" src="js/index.js"></script>
	<script type="text/javascript" src="js/cart.js"></script>
  </body>
</html>